<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2020/12/30
  Time: 10:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>left</title>
</head>
<body>
<style>
    ul li{
        line-height: 25px;
        font-size:20px;
    }
</style>
<script>
    $(function(){
        createMenuByRoleId();

        $('#aa ul li').on('click',function(){
            var a = $(this).find('a');
            var html = $(a).html();
            var icon = $(this).attr('icon');
            var src = $(this).attr('src');
            addTab(html,icon,src);
        })
    });

    function createMenuByRoleId(){
        var roleId  = $('#roleId').val();
        $.ajax({
            type:'post',
            url:'${ctx}/mc/getMenuByRoleId',
            data:{
                roleId:roleId
            },
            async:false,//把异步改为同步操作
            dataType:'json',
            success:function(result){
                result = JSON.parse(result);

                if(result.length>0){
                    for(var i=0;i<result.length;i++){
                        var str = '';
                        var root = result[i];
                        str = '<div title="'+root.menuName+'" data-options="iconCls:\'icon-reload\',selected:true" style="padding:10px;">';
                        var data = root.children;
                            str += '<ul>';
                            for(var j=0;j<data.length;j++){
                                var branch = data[j];
                                str += '<li icon="'+branch.icon+'" src="${ctx}/'+branch.src+'"><a href="#">'+branch.menuName+'</a></li>';
                            }
                            str += '</ul>';
                        str += '</div>'

                        $('#aa').append(str);
                    }

                }
            }
        })
    }

</script>
<input type="hidden" value="${user.roleId}" id="roleId">
<div id="aa" class="easyui-accordion" data-options="fit:true">
    <div title="项目述说" data-options="iconCls:'icon-save'" style="overflow:auto;padding:10px;">
        <h3 style="color:#0099FF;">Accordion for jQuery</h3>
        <p>Accordion is a part of easyui framework for jQuery.
            It lets you define your accordion component on web page more easily.</p>
    </div>
    <div>
        <ul>
            <li src="${ctx}/uc/index">
                <a>用户管理</a>
            </li>
        </ul>
    </div>
</div>
</body>
</html>

